<template>
  <div>
    <a-spin
      tip="Loading..."
      :delay="delayTime"
    />
    <div style="width:300px;height: 300px;line-height: 300px;text-align:center;border:1px solid red">
      <a-spin />

    </div>
    <a-spin
      :spinning="spinning"
      style="width:30%"
    >
      <a-alert
        style="width:30%"
        message="Alert message title"
        description="Further details about the context of this alert."
      ></a-alert>
    </a-spin>
    <a-spin>
      <div style="width: 100px;height: 50px;border:1px solid red"></div>
    </a-spin>

  </div>
</template>

<script>
export default {
  name: '',
  components: {},
  data() {
    return {
      delayTime: 1500,
      spinning: true
    }
  },
  created() { },
  mounted() { },
  methods: {},
  computed: {}
}
</script>
<style scoped lang='scss'>
</style>
